<template>
  <div class="farm2-data-querys-operators">
    <!--默认查询框，从外部传入条件提示-->
    <el-input :placeholder="props.placeholder" @keyup.enter="onQueryClick" v-model="defaultRule"
      class="input-with-select">
      <template #append>
        <el-button @click="onQueryClick" icon="Search" />
      </template>
      <template #prepend>
        <el-button @click="onClearClick" icon="Delete" />
      </template>
    </el-input>
    <el-button v-if="props.isShowQueryPlus" type="primary" size="small" title="组合查询" @click="openQueryFormClick" circle
      :plain="true">
      <el-icon>
        <Filter />
      </el-icon>
    </el-button>
    <br />
  </div>
</template>
<script setup lang="ts">
import type { DataQuery } from '@/types/commons/DataQuery';
import { PageEvent } from '@/types/commons/PageEvent';
import type { Emitter, EventType } from 'mitt';
import { inject, ref } from 'vue'
const props = defineProps<{ placeholder: string, isShowQueryPlus: boolean }>();
const eventBus = inject('eventBus') as Emitter<Record<EventType, unknown>>;
//>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>

const defaultRule = ref('');

//执行查询
const onQueryClick = () => {
  const query: DataQuery = { rules: [] };
  query.rules?.push({ key: 'default', value: defaultRule.value, compara: 'like' });
  eventBus.emit(PageEvent.data_do_query, query)
}

//清理条件
const onClearClick = () => {
  defaultRule.value = '';
  onQueryClick();
  eventBus.emit(PageEvent.query_form_clear);
}

//打开高级查询窗口
const openQueryFormClick = () => {
  eventBus.emit(PageEvent.query_form_open, true);
}

//>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>
</script>
<style scoped>
/* 样式可以根据需要添加 */
</style>
